<!DOCTYPE html>
<html>
  <head>
    <title>图书列表</title>
    <style>
      li {
        margin-bottom: 20px;
      }
      li img {
        width: 80px;
        height: 100px;
      }
      .old {
        font-size: 12px;
        color: #dddddd;
      }
      .new {
        font-size: 14px;
        color: #000;
      }
      p {
        padding: 0;
        margin: 0;
      }
    </style>
  </head>
  <body>
    <h1>图书列表</h1>
    <ol>
      <li>
        <img src="../img/计算机基础.webp" /><br />
        <a
          href="https://baike.baidu.com/item/%E8%AE%A1%E7%AE%97%E6%9C%BA%E5%9F%BA%E7%A1%80/62009592?fr=ge_ala"
        >
          计算机基础
        </a>
        <p>
          <span class="old">原价111￥</span>&nbsp;
          <span class="new">现价79￥</span>
        </p>
      </li>
      <li>
        <img src="../img/电工学.webp" /><br />
        <a
          href="https://baike.baidu.com/item/%E7%94%B5%E5%B7%A5%E5%AD%A6/5335051?fr=ge_ala"
          >电工学
        </a>
        <p>
          <span class="old">原价150￥</span>&nbsp;
          <span class="new">现价99￥</span>
        </p>
      </li>
      <li>
        <img src="../img/中国文化简史.webp" /><br />
        <a
          href="https://baike.baidu.com/item/%E4%B8%AD%E5%9B%BD%E6%96%87%E5%8C%96%E7%AE%80%E5%8F%B2/59867432?fr=aladdin"
          >中国文化简史
        </a>
        <p>
          <span class="old">原价89￥</span>&nbsp;
          <span class="new">现价55￥</span>
        </p>
      </li>
    </ol>
  </body>
</html>
